<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        let objs = {
            users: [
                {
                    name: "tom",
                    age: 20,
                    sex: "男",
                    hobby: "打篮球",
                    address: "南京"
                },
                {
                    name: "alice",
                    age: 20,
                    sex: "女",
                    hobby: "弹钢琴",
                    address: "上海"
                },
                {
                    name: "cici",
                    age: 22,
                    sex: "女",
                    hobby: "跳舞",
                    address: "北京"
                },
                {
                    name: "lucy",
                    age: 23,
                    sex: "男",
                    hobby: "打网球",
                    address: "苏州"
                },
                {
                    name: "cici",
                    age: 24,
                    sex: "男",
                    hobby: "看动漫",
                    address: "天津"
                }
            ]
        };
        window.onload = function () {
            let { users } = objs;
            let str="";
            for (var i = 0; i < users.length; i++) {
                 str += `
                <div>
                    <p>${users[i].name}</p>
                    <p>${users[i].age}</p>
                    <p>${users[i].sex}</p>
                    <p>${users[i].hobby}</p>
                    <p>${users[i].address}</p>
                
                </div>`;
            }
            let container=document.querySelector(".container");
            container.innerHTML=str;
        };
    </script>
</head>

<body>
    <div class="container"></div>
</body>

</html>